﻿<%@ page language="java" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<base href="<%=basePath%>" />
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>登陆</title>
		<script type="text/javascript" src="<%=basePath%>/js/jquery.js"></script>
		<script type="text/javascript" src='<%=basePath %>/js/jquery.blockUI.js'></script>
		<style type="text/css">
			<!--
			body {
				margin-left: 0px;
				margin-top: 0px;
				margin-right: 0px;
				margin-bottom: 0px;
				background-color: #1D3647;
			}
			-->
			label {
				font-size: 12px;
				font-family: arial, sans-serif;
				list-style-type: none;
				color: #486783;
				text-shadow: #fff 1px 1px;
				margin-bottom: 10px;
				font-weight: bold;
				letter-spacing: 1px;
				text-transform: uppercase;
				display: block;
			}
			
			form {
			    width: 250px;
			    padding: 20px;
			    border: 1px solid #270644;
			}
			
			form {
	   			width: 250px;
			    padding: 20px;
			    border: 1px solid #B7C0CF;
			 
			    /*** Adding in CSS3 ***/
			 
			    /*** Rounded Corners ***/
			    -moz-border-radius: 20px;
			    -webkit-border-radius: 20px;
			 
			    /*** Background Gradient - 2 declarations one for Firefox and one for Webkit ***/
			    background:  -moz-linear-gradient(19% 75% 90deg,#F4F5F9, #B7C0CF);
			    background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#F4F5F9), to(#B7C0CF));
			 
			    /*** Shadow behind the box ***/
			    -moz-box-shadow:0px -5px 300px #F4F5F9;
			    -webkit-box-shadow:0px -5px 300px #F4F5F9;
			}
		input {
		    width: 230px;
		    background: #486783;
		    padding: 6px;
		    margin-bottom: 10px;
		    border-top: 1px solid #486783;
		    border-left: 0px;
		    border-right: 0px;
		    border-bottom: 0px;
		}
		
		input {
		    width: 230px;
		    background: #486783;
		    padding: 6px;
		    margin-bottom: 10px;
		    border-top: 1px solid #486783;
		    border-left: 0px;
		    border-right: 0px;
		    border-bottom: 0px;
		 
		    /*** Adding CSS3 ***/
		 
		    /*** Transition Selectors - What properties to animate and how long ***/
		    -webkit-transition-property: -webkit-box-shadow, background;
		    -webkit-transition-duration: 0.25s;
		 
		    /*** Adding a small shadow ***/
		    -moz-box-shadow: 0px 0px 2px #000;
		    -webkit-box-shadow: 0px 0px 2px #000;
		}
		
		input:hover {
		    -webkit-box-shadow: 0px 0px 4px #000;
		    background: #1D3647;
		}
		
		input.button {
		    width: 100px;
		    color: #486783;
		    text-transform: uppercase;
		    text-shadow: #fff 1px 1px;
		    border-top: 1px solid #486783;
		    margin-top: 10px;
		}
		
		input.button {
		    width: 100px;
		    color: #486783;
		    text-transform: uppercase;
		    text-shadow: #fff 1px 1px;
		    border-top: 1px solid #B8C1D0;
		    margin-top: 10px;
		 
		    /*** Adding CSS3 Gradients ***/
		    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#F4F5F9), to(#B7C0CF));
		    background:  -moz-linear-gradient(19% 75% 90deg,#F4F5F9, #B7C0CF);
		}
		</style>
		<link href="images/skin.css" rel="stylesheet" type="text/css" />
		<script type="text/javascript">
			function login() {
				var username = $("username").attr("value") ;
				var password = $("password").attr("value") ;
				if(username!='' && password!='') {
					log_form.submit();
				}else {
					alert("请输入用户名或密码");
				}
			}
			$(function(){
				if('${requestScope.error}'!='') {
					alert('${requestScope.error}');
				}
			});
		</script>
	</head>
	<body>
		<table width="100%" height="100%" border="0" cellpadding="0"
			cellspacing="0" >
			<tr>
				<td height="20%" valign="top">
					<table width="100%" height="42" border="0" cellpadding="0"
						cellspacing="0" class="login_top_bg">
						<tr>
							<td width="1%" height="21">
								&nbsp;
							</td>
							<td height="42">
								&nbsp;
							</td>
							<td width="17%">
								&nbsp;
							</td>
						</tr>
					</table>
				</td>
			</tr>
			<tr>
				<td valign="top">
					<table width="100%" height="580px" border="0" cellpadding="0"
						cellspacing="0" class="login_bg">
						<tr>
							<td colspan="3">
								<div class="log_div" style="margin-right: auto;margin-left: auto;" >
								<form style="margin: auto;" action="<%=basePath %>/servlet/LoginServlet" method="post" id="log_form">
								        <label>用户名:</label>
								            <input type="text" name="username" />
								        <label>密&nbsp;&nbsp;&nbsp;&nbsp;码:</label>
								            <input type="password" name="password"  />
								            <input type="button" value="登录" class="button" onclick="login()"/>
								</form>
								</div>
							</td>
						</tr>
					</table>
				</td>
			</tr>
			<tr>
				<td height="auto" align="center">
					<span class="login-buttom-txt">Copyright &copy; 2012-2013 </br>
									www.cnblogs.com/stackoverflow</span>
				</td>
			</tr>
		</table>
	</body>
</html>
